<template>
  <Header />
  <van-address-list
    :list="addressList"
    default-tag-text="默认"
    @add="onAdd"
    @edit="onEdit"
    :switchable="false"
  />
</template>

<script>
import {  onMounted, reactive,toRefs } from "vue";
import { useRouter } from "vue-router";
import Header from "../../../components/Header";
import { useStore } from "vuex";
export default {
  components: {
    Header,
  },
  setup() {
    let data=reactive({
      addressList:[]
    })
    const router = useRouter();
    const store = useStore();
    const onAdd = () => {
      router.push({
        path: "./addressDesc",
      });
    };
    const init =() => {
      let userAddress = store.state.countAbout.userAddress;
      data.addressList = userAddress.map((item) => {
        item.address =item.province + item.city + item.county + item.addressDetail   
        return item
      })     
    }
    const onEdit = (item) => {
      item.type="edit"
      router.push({
        path: "./addressDesc",
        query: item,
      });
    };
    onMounted(()=>{
      init()
    })
    return {
      ...toRefs(data),
      onAdd,
      onEdit,
    };
  },
};
</script>

<style>
</style>